<!DOCTYPE html>
<!-- saved from url=(0056)http://startbootstrap.com/templates/simple-sidebar.html# -->
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<title>Panel</title>
<script src="<?php echo base_url();?>js/chart.js"></script>
<?php $this->load->view('panel_head');?>
</head>

<body>


<script language="javascript">
function chk()
{	
	if(document.getElementById("mem_pass").value != document.getElementById("confirm_pass").value)
	{
		alert('Password Not Match');
		document.getElementById("mem_pass").style.borderColor = "#E34234";
		document.getElementById("confirm_pass").style.borderColor = "#E34234";
		document.getElementById("confirm_pass").focus();
		return false;
	}
	
	var fty=new Array(".gif",".jpg",".jpeg",".png"); // ประเภทไฟล์ที่อนุญาตให้อัพโหลด   
        var a=document.form1.file_1.value; //กำหนดค่าของไฟล์ใหกับตัวแปร a   
		var permiss=0; // เงื่อนไขไฟล์อนุญาต
		a=a.toLowerCase();   
		if(a !=""){
			for(i=0;i<fty.length;i++){ // วน Loop ตรวจสอบไฟล์ที่อนุญาต   
				if(a.lastIndexOf(fty[i])>=0){  // เงื่อนไขไฟล์ที่อนุญาต   
					permiss=1;
					break;
				}else{
					continue;
				}
			}  
			if(permiss==0){ 
				alert("อัพโหลดได้เฉพาะไฟล์ gif jpg jpeg png");     
				return false;   			
			} 		
		}

}
</script>

<script type="text/javascript">

		
          $(document).ready(function(){
            $("#mem_name").change(function(){
            $("#message").html("checking...");
             
 
            var mem_name=$("#mem_name").val();
 
              $.ajax({
                    type:"post",
                    url:"<?php echo base_url();?>index.php/pmember/check_already/user",
                    data:"mem_name="+mem_name,
                        success:function(data){
                        if(data==0){
                            $("#message").html("".fontcolor("green"));
							document.getElementById("mem_name").style.borderColor = "green";
							document.getElementById("submit").disabled=false;
						} else {
                            $("#message").html("Username already exists".fontcolor("red"));
							document.getElementById("mem_name").focus();
							document.getElementById("mem_name").style.borderColor = "#E34234";
							document.getElementById("submit").disabled=true;
                        }
						
                    }
                 });
 
            });
 
         });
		 
 
</script>



<?php $this->load->view('header');?>
<div style="height:46px;"></div>
<div > 
  
  <!-- Page content -->
  <div id="page-content-wrapper">
   
    <!-- Keep all page content within the page-content inset div! -->
	<?php $attributes = array('onsubmit' => 'return chk()', 'id' => 'form1' ,'name' => 'form1'); ?>
    <?php echo form_open_multipart('pmember/add_register' ,$attributes);?>
    <input type="hidden" name="seg1" value="<?php echo $this->uri->segment(1);?>" ?>
    <input type="hidden" name="seg2" value="<?php echo $this->uri->segment(2);?>" ?>
    <div class="page-content inset">
      <div class="panel panel-default">
        <div class="panel-body">
            <div class="content-header">
              <h1><span class="glyphicon glyphicon-user"></span>&nbsp;Sing up</h1>
            </div>
          <div class="row" style="margin-bottom:1.5em;">
            <div class="col-md-4">
              <h5><strong>Username<font size="-1"><em> (require)</em></font></strong></h5>
            </div>
            <!-- <div class="col-md-4"> -->
            <div class="col-md-8">
              <input type="text" class="form-control" style="width:22em;" name="mem_name" id="mem_name" placeholder="username" required>
              <p id="message"></p>
            </div>
            <!-- <div class="col-md-8"> --> 
          </div>
          <!-- <div class="row"> -->
          
          <div class="row" style="margin-bottom:1.5em;">
            <div class="col-md-4">
              <h5><strong>E-mail <font size="-1"><em>(require)</em></font></strong></h5>
            </div>
            <!-- <div class="col-md-4"> -->
            <div class="col-md-8">
              <input type="email" class="form-control" style="width:22em;" name="mem_mail" placeholder="stream@mail.com" required>
            </div>
            <!-- <div class="col-md-8"> --> 
          </div>
          <!-- <div class="row"> -->
          
          <div class="row" style="margin-bottom:1.5em;">
            <div class="col-md-4">
              <h5><strong>First Name</strong></h5>
            </div>
            <!-- <div class="col-md-4"> -->
            <div class="col-md-8">
              <input type="text" class="form-control" style="width:22em;" name="mem_fname" placeholder="firstname" required>
            </div>
            <!-- <div class="col-md-8"> --> 
          </div>
          <!-- <div class="row"> -->
          
          <div class="row" style="margin-bottom:1.5em;">
            <div class="col-md-4">
              <h5><strong>Last Name</strong></h5>
            </div>
            <!-- <div class="col-md-4"> -->
            <div class="col-md-8">
              <input type="text" class="form-control" style="width:22em;" name="mem_lname" placeholder="lastname" required>
            </div>
            <!-- <div class="col-md-8"> --> 
          </div>
          <!-- <div class="row"> -->
          
          <div class="row" style="margin-bottom:1.5em;">
            <div class="col-md-4">
              <h5><strong>Date of Birth</strong></h5>
            </div>
            <!-- <div class="col-md-4"> -->
            <div class="col-md-8">
            <?php 
				$datestring = "%Y-%m-%d";
				$time = time(); 				
			?>
            <input type="text" id="date" data-format="YYYY-MM-DD" data-template="D MMM YYYY" name="mem_birth"  value="<?php echo mdate($datestring, $time); ?>" />
            
            <script id="js-date">
				$(function(){
					$('#date').combodate();    
				});
			</script>

           
            </div>
            <!-- <div class="col-md-8"> --> 
          </div>
          <!-- <div class="row"> -->
          
           <div class="row" style="margin-bottom:1.5em;">
            <div class="col-md-4">
              <h5><strong>Address</strong></h5>
            </div>
            <!-- <div class="col-md-4"> -->
            <div class="col-md-8">
              <textarea class="form-control" rows="5" style="width:22em;" name="mem_address" placeholder="123/4 CS Channel Co., Ltd"></textarea>
            </div>
            <!-- <div class="col-md-8"> --> 
          </div>
          <!-- <div class="row"> -->
          
          <div class="row" style="margin-bottom:1.5em;">
            <div class="col-md-4">
              <h5><strong>Telephone Number</strong></h5>
            </div>
            <!-- <div class="col-md-4"> -->
            <div class="col-md-8">
              <input type="text" class="form-control" style="width:22em;" name="mem_tell" placeholder="08x-xxxxxxx">
            </div>
            <!-- <div class="col-md-8"> --> 
          </div>
          <!-- <div class="row"> -->
          
          <div class="row" style="margin-bottom:1.5em;">
            <div class="col-md-4">
              <h5><strong>Profile picture</strong></h5>
            </div>
            <!-- <div class="col-md-4"> -->
            <div class="col-md-8">
              <input type="file" id="file_1" name="userfile" size="20" />
            </div>
            <!-- <div class="col-md-8"> --> 
          </div>
          <!-- <div class="row"> --> 
          
             
          <div class="row" style="margin-bottom:1.5em;">
            <div class="col-md-4">
              <h5><strong>Password<font size="-1"><em> (require)</em></font></strong></h5>
            </div>
            <!-- <div class="col-md-4"> -->
            <div class="col-md-8">
              <input type="password" class="form-control" style="width:22em;" name="mem_pass" id="mem_pass" placeholder="password" required>
            </div>
            <!-- <div class="col-md-8"> --> 
          </div>
          <!-- <div class="row"> -->
          
             
          <div class="row" style="margin-bottom:1.5em;">
            <div class="col-md-4">
              <h5><strong>Repeat Password<font size="-1"><em> (require)</em></font></strong></h5>
            </div>
            <!-- <div class="col-md-4"> -->
            <div class="col-md-8">
              <input type="password" class="form-control" id="confirm_pass" style="width:22em;" placeholder="repeat password">
            </div>
            <!-- <div class="col-md-8"> --> 
          </div>
          <!-- <div class="row"> -->
          
           <div class="row">
            <div class="col-md-12" align="center">
            <button type="submit" class="btn btn-primary" id="submit">Add New Member	</button>
            </div>
            <!-- <div class="col-md-4"> -->
            
           
            <!-- <div class="col-md-8"> --> 
          </div>
          <!-- <div class="row"> -->
          
          
        </div>
        <!-- <div class="panel-body"> --> 
      </div>
      <!-- <div class="panel panel-default"> --> 
    </div>
    <!-- <div class="page-content inset"> --> 
    <?php echo form_close();?>
    
  </div>
  <!--  <div id="page-content-wrapper"> --> 
  
</div>
<!-- <div id="wrapper"> --> 





<!-- Custom JavaScript for the Menu Toggle --> 
<script>
    $("#menu-toggle").click(function(e) {
        e.preventDefault();
        $("#wrapper").toggleClass("active");
    });
</script> 
<script>
$('#select-all').click(function(event) {   
    if(this.checked) {
        // Iterate each checkbox
        $(':checkbox').each(function() {
            this.checked = true;                        
        });
    }else{
		$(':checkbox').each(function() {
			this.checked = false;
		});
	}
});
</script>
</body>
</html>